<template>
	<view :style="{height: height}">
		
		<view class="content">
			<image src="../../static/startup/logo.png" class="logo"></image>
			<view class="webkit input">
				<image src="../../static/shouji.png"></image>
				<input class="flex" type="text" @blur="mobileInput1" placeholder-style="color:#aaa" placeholder="请输入您的手机号"/>
			</view>
			<view class="webkit input" style="position: relative;">
				<image src="../../static/shouji.png"></image>
				<input class="flex" type="text" placeholder-style="color:#aaa" v-model="mobile" @click="mobileInput" placeholder="请选择您的登录账号"/>
				<scroll-view v-if="error == 1" scroll-y="true" style="height: 200upx;width: 750upx;position: absolute;top: 10upx;left: 80upx;background-color: #fff;z-index: 9;">
					<view v-for="(item,index) in openid" :key="index">
						<view style="height: 50upx;line-height: 50upx;" @click="select(item)">
							{{item}}
						</view>
					</view>
				</scroll-view>
			</view>
			<view class="webkit input">
				<image src="../../static/pass1.png"></image>
				<input class="flex" type="text" placeholder-style="color:#aaa" @input="pwdInput" @blur="pwdInput" password  placeholder="请输入您的密码"/>
			</view>
			<button type="warn" style="background-color: #2FA2FF;" :loading="loading" @click="login">登录</button>
			<view class="btn-group webkit">
				<view class="flex"></view>
			</view>
		</view>
		
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				width:0,
				height:0,
				mobile:'',
				pwd:'',
				systemInfo:{},
				loading:false,
				openid:[],
				error:'',
			};
		},
		onLoad:function(){
			uni.hideLoading();
			uni.getSystemInfo({
				success: (res) => {
					this.systemInfo = res
					this.width = res.windowWidth
					this.height = res.windowHeight
				}
			})
		},
		onBackPress(options) {
				this.back();  
				return true;  
		},  
		methods: {
			select(item){
				console.log(item)
				this.error = 0
				this.mobile = item
			},
			mobileInput1(e){
				
				if(e.target.value.length<=6){
					return
				}
				uni.request({
					url: 'https://app.t9y9y9.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.obtain&app=1',
					method: 'POST',
					data: {
						mobile:e.target.value,
						},
				header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						console.log(res)
						this.openid = res.data.openid
						this.error = res.data.error
						if(res.data.error==0){
							uni.showToast({
								title:res.data.message,
								icon:"none"
							})
						}
					},
					fail: () => {},
					complete: () => {}
				});
				
			},
			mobileInput(){
				this.error = 1
				if( this.mobile == ''){
					uni.showToast({
						title:'请先输入手机号',
						icon:"none"
					})
				}
			},
			pwdInput(e){
				this.pwd = e.target.value
			},
			back(){
				uni.reLaunch({
					url: '../home/home'
				});
			},
			jump(e){
				uni.navigateTo({
					url: e.currentTarget.dataset.src
				});
			},
			weixin_load() {
				uni.showToast({
					title: '即将开放',
					icon:"none"
				});
				return
				var _self;
				// #ifdef APP-PLUS
				uni.login({
					success: (res) => {
						 uni.getUserInfo({
							success: (info) => {
								// 与服务器交互将数据提交到服务端数据库
								uni.request({
									url: 'https://app.t9y9y9.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.applogin&app=1',
									method: 'POST',
									header: {'content-type' : "application/x-www-form-urlencoded"},
									data: {
										 openid: info.userInfo.openId,
										 nickname: info.userInfo.nickName,
										 avatar: info.userInfo.avatarUrl,
										 province: info.userInfo.province,
										 city: info.userInfo.city,
									},
									success: res => {
										console.log(res)
										if(res.statusCode == 200){
											uni.setStorage({
												key: 'openid',
												data: res.data.openid,
												success: (res) => {},
												fail: () => {}
											})
											uni.setStorage({
												key: 'mid',
												data: res.data.mid,
												success: (res) => {},
												fail: () => {}
											})
											setTimeout(()=>{
												this.loading = false
												uni.reLaunch({
													url: '../member/member'
												});
											},500)
											uni.showToast({
												title: '登陆成功',
												mask: false,
												duration: 1500
											});
										}else{
											uni.showToast({title:'微信登陆失败'});
										}
									},
									fail: () => {
										console.log('登陆失败')
									},
									complete: () => {}
								});
							},
							fail: () => {
								uni.showToast({title:"微信登录授权失败"});
							}
						})
					},
					fail: () => {
						uni.showToast({title:"微信登录授权失败"});
					}
				})
			// #endif
			},
			login(){
				this.loading = true
				if(this.mobile == ""){
					this.loading=false
					uni.showToast({
						title: '请输入手机号',
						icon:"none"
					});
				}else if(this.pwd == ""){
					this.loading = false
					uni.showToast({
						title: '请输入密码',
						icon:"none"
					});
				}else{
					var data = {
							'openid': this.mobile,
							'pwd': this.pwd,
						}
						console.log(JSON.stringify(data))
					uni.request({
						url: 'https://app.t9y9y9.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.login&app=1',
						method: 'POST',
						data: data,
						header:{'Content-Type':'application/x-www-form-urlencoded'},
						success: res => {
							// console.log(JSON.stringify(res));return false;
							if(res.data.status == 0){
								uni.showToast({
									title: res.data.result.message,
									icon:"none"
								});
								this.loading = false
							}else{
								uni.setStorage({
									key: 'openid',
									data: res.data.result.openid,
									success: (res) => {},
									fail: () => {}
								})
								uni.setStorage({
									key: 'mid',
									data: res.data.result.mid,
									success: (res) => {},
									fail: () => {}
								})
								setTimeout(()=>{
									this.loading = false
									uni.reLaunch({
										url: '../member/member'
									});
								},500)
							}
						},
						fail: () => {},
						complete: () => {}
					});
				}
			}
		}
	}
</script>

<style>
	page {background-color:#fff;}
	image {width:240upx;height:240upx;}
	button {margin:60upx 30upx 20upx;}
	.logo {display:block;margin:0 auto 60upx;}
	.content {position:fixed;width:750upx;top:50%;margin-top:-550upx;}
	.input {border-bottom:1px solid #f0f0f0;margin:0 30upx;}
	.input image {width:50upx;height:50upx;margin-left:20upx;margin-right:10upx;margin-top:15upx;}
	.input input {line-height:80upx;font-size:28upx;height:80upx;}
	.btn-group{margin:0 30upx;}
	.btn-group view {color:#999;}
</style>
